<template>
    <div style="overflow-x: hidden; width: 100%">
        <!--        分割线-->
        <hr style="border: 1px dashed darkgray;transform: scaleY(0.5); margin-top: -1px;">
        <div v-if="queryDetail">
            <el-tabs type="border-card" @tab-click="handlClick" style="position: absolute; width: 99%;">
                <el-row v-if="active===0">
                    <el-col :span="3">
                        <el-input v-model="caseLawSearch.searchData" clearable></el-input>
                    </el-col>
                    <el-col :span="3">
                        <el-select v-model="caseLawSearch.select" filterable placeholder="请选择">
                            <el-option label="委托人搜索" value="1"></el-option>
                            <el-option label="对方当事人搜索" value="2"></el-option>
                            <el-option label="案号搜索" value="3"></el-option>
                            <el-option label="案由搜索" value="4"></el-option>
                            <el-option label="归档号搜索" value="5"></el-option>
                            <el-option label="受理机关搜索" value="6"></el-option>
                            <el-option label="受理法院搜索" value="7"></el-option>
                        </el-select>
                    </el-col>
                    <el-col :span="3">
                        <el-select v-model="caseLawSearch.caseApproveStatus" clearable>
                            <el-option label="审批中" value="1"></el-option>
                            <el-option label="审批通过" value="2"></el-option>
                            <el-option label="审批不通过" value="3"></el-option>
                        </el-select>
                    </el-col>
                    <el-col :span="3">
                        <el-select v-model="caseLawSearch.caseCaseTypeId" filterable placeholder="请选择" clearable>
                        <span v-for="(item,index) in caseTypeData" :key="index">
                            <el-option :value="item.id+''" :label="item.caseTypeName"></el-option>
                        </span>
                        </el-select>
                    </el-col>
                    <el-col :span="3">
                        <el-select v-model="caseLawSearch.caseSettleStatus" clearable>
                            <el-option label="已结案" value="Y"></el-option>
                            <el-option label="未结案" value="N"></el-option>
                        </el-select>
                    </el-col>
                    <el-col :span="3">
                        <el-select v-model="caseLawSearch.sortMode">
                            <el-option label="自定义排序" value="1"></el-option>
                            <el-option label="编号倒序" value="2"></el-option>
                            <el-option label="登记时间正序" value="3"></el-option>
                            <el-option label="登记时间倒序" value="4"></el-option>
                            <el-option label="收案时间正序" value="5"></el-option>
                            <el-option label="收案时间倒序" value="6"></el-option>
                        </el-select>
                    </el-col>
                    <el-col :span="1" :offset=1>
                        <el-button type="primary" @click="seniorSearch">检索</el-button>
                    </el-col>
                </el-row>
                <el-tab-pane label="全所案件">
                    <div v-if="active===0">
                        <el-table
                                :data="caseData"
                                border
                                style="width: 100%;margin-top: 10px;margin-bottom: 10px"
                                :cell-style="cellStyle">
                            <el-table-column
                                    align="center"
                                    prop="caseNo"
                                    label="案号"
                                    width="149">
                                <template slot-scope="scope">
                                    <a href="javascript:" @click="queryDetails(scope.row.id)">
                                        {{scope.row.caseNo}}
                                    </a>
                                </template>
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseWtr"
                                    label="委托人">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseOppositeParties"
                                    label="对方当事人"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseAttorney"
                                    label="承办律师">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseSettleStatus"
                                    label="结案状态"
                                    :formatter="caseSettleStatusFormatter"
                                    width="100">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseAgencyfee"
                                    label="代理费(元)"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="casePaidsal"
                                    label="已付款(元)"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseInvoiced"
                                    label="已开票(元)"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseApproveStatus"
                                    label="审批状态"
                                    :formatter="caseApproveStatusFormatter"
                                    width="105">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseContract"
                                    label="合同"
                                    :formatter="caseContractFilenumberFormatter"
                                    width="60">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseRecord"
                                    label="档案"
                                    :formatter="caseContractFilenumberFormatter"
                                    width="60">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    label="操作"
                                    width="105">
                                <template slot-scope="scope">
                                    <el-dropdown trigger="click">
                                        <el-button type="primary" @click="handleClick(scope.row.id)" class="share_btn" :id="scope.row.hrEmpId">
                                            操作<i class="el-icon-arrow-down el-icon--right"></i>
                                        </el-button>
                                        <el-dropdown-menu slot="dropdown">
                                            <el-dropdown-item @click.native="standard(scope.row.standard,scope.row.clientId)">费用减免申请</el-dropdown-item>
                                            <el-dropdown-item
                                                    @click.native="casePaidsal(scope.row.caseAgencyfee,scope.row.caseProxysal,scope.row.caseSubsidysal,scope.row.caseFxmoney,scope.row.casePaidsal)"
                                            >添加收款记录</el-dropdown-item>
                                            <el-dropdown-item @click.native="caseShare(scope.row.caseShare)">{{scope.row.caseShare==="2"?'共享':'取消共享'}}</el-dropdown-item>
                                        </el-dropdown-menu>
                                    </el-dropdown>
                                </template>
                            </el-table-column>
                        </el-table>
                        <el-pagination
                                @size-change="handleSizeChange"
                                @current-change="handleCurrentChange"
                                :current-page="1"
                                :page-sizes="[1, 5, 10, 20, 50, 100]"
                                :page-size="pageSize"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="total">
                        </el-pagination>
                    </div>
                    <div v-if="active===1" style="margin-top: 30px">
                        <CaseReduction :caseId="caseId" @changeActive="changeActive"></CaseReduction>
                    </div>
                    <div v-if="active===2">
                        <CasePaidsal :caseId="caseId" :caseUnpaidsal="caseUnpaidsal" @changeActive="changeActive"></CasePaidsal>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="全所待收款案件">
                    <div v-if="active===0">
                        <el-table
                                :data="caseData"
                                border
                                style="width: 100%;margin-top: 10px;margin-bottom: 10px"
                                :cell-style="cellStyle">
                            <el-table-column
                                    align="center"
                                    prop="caseNo"
                                    label="案号"
                                    width="149">
                                <template slot-scope="scope">
                                    <a href="javascript:" @click="queryDetails(scope.row.id)">
                                        {{scope.row.caseNo}}
                                    </a>
                                </template>
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseWtr"
                                    label="委托人">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseOppositeParties"
                                    label="对方当事人"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseAttorney"
                                    label="承办律师">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseAgencyfee"
                                    label="代理费(元)"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="casePaidsal"
                                    label="已付款(元)"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseUnpaidsal"
                                    label="未付金额"
                                    width="100">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseInvoiced"
                                    label="已开票(元)"
                                    width="103">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseApproveStatus"
                                    label="审批状态"
                                    :formatter="caseApproveStatusFormatter"
                                    width="105">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    label="操作"
                                    width="105">
                                <template slot-scope="scope">
                                    <el-dropdown trigger="click">
                                        <el-button type="primary" @click="handleClick(scope.row.id)">
                                            操作<i class="el-icon-arrow-down el-icon--right"></i>
                                        </el-button>
                                        <el-dropdown-menu slot="dropdown">
                                            <el-dropdown-item @click.native="standard(scope.row.standard,scope.row.clientId)">费用减免申请</el-dropdown-item>
                                            <el-dropdown-item
                                                    @click.native="casePaidsal(scope.row.caseAgencyfee,scope.row.caseProxysal,scope.row.caseSubsidysal,scope.row.caseFxmoney,scope.row.casePaidsal)"
                                            >添加收款记录</el-dropdown-item>
                                            <el-dropdown-item @click.native="caseShare(scope.row.caseShare)">{{scope.row.caseShare==="2"?'共享':'取消共享'}}</el-dropdown-item>
                                        </el-dropdown-menu>
                                    </el-dropdown>
                                </template>
                            </el-table-column>
                        </el-table>
                        <el-pagination
                                @size-change="handleSizeChange"
                                @current-change="handleCurrentChange"
                                :current-page="1"
                                :page-sizes="[1, 5, 10, 20, 50, 100]"
                                :page-size="pageSize"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="total">
                        </el-pagination>
                    </div>
                    <div v-if="active===1" style="margin-top: 30px">
                        <CaseReduction :caseId="caseId" @changeActive="changeActive"></CaseReduction>
                    </div>
                    <div v-if="active===2">
                        <CasePaidsal :caseId="caseId" :caseUnpaidsal="caseUnpaidsal" @changeActive="changeActive"></CasePaidsal>
                    </div>
                </el-tab-pane>
            </el-tabs>
        </div>
        <div v-if="!queryDetail">
            <CaseDetails :case-id="caseId" @back="back"></CaseDetails>
        </div>
    </div>
</template>

<script>
    import AddCaseService from "../../model/AddCaseService";
    import CaseReduction from "./CaseReduction";
    import CasePaidsal from "./CasePaidsal";
    import CaseDetails from "./CaseDetails";

    const addCaseService =AddCaseService.getInstance();
    export default {
        name: "AllCase",
        components:{
            CaseReduction,
            CasePaidsal,
            CaseDetails
        },
        data(){
            return{
                caseTypeData:[],//案件类型下拉框
                caseData:[],//案件表格数据
                caseId:"",//存储操作数据的主键
                caseUnpaidsal:"",//剩余未付金额
                tabIndex:"0",//存储当前标签页码
                active:0,//显示与隐藏
                queryDetail:true,//查看案件详情
                lawyers:[],//办案律师数据
                sealApplyfor:[],//用印申请数据

                total:"",//数据总条数
                pageSize:5,//每页显示条数
                pageNum:1,//当前页

                ops: {//滚动条
                    vuescroll: {},
                    scrollPanel: {},
                    rail: {},
                    bar: {}
                },
                caseLawSearch:{
                    searchData:"",//搜索框数据
                    select:"",//下拉框选项
                    caseApproveStatus:"",//审批状态
                    caseCaseTypeId:"",//案件类型
                    caseSettleStatus:"",//结案状态
                    sortMode:"1",//排序方法
                },

            }
        },
        created() {
            this.queryCaseType();
            this.querySummaryCases(null);
        },
        methods:{
            seniorSearch(){//高级检索
                this.pageSize=5;
                if(this.tabIndex==="1"){
                    this.queryPayCase(null)
                }else{
                    this.querySummaryCases(null)
                }
            },
            handleCurrentChange(val){//当前页发生变化
                if(this.tabIndex==="1"){
                    const page={
                        pageNum:val
                    };
                    this.queryPayCase(page)
                }else{
                    const page={
                        pageNum:val
                    };
                    this.querySummaryCases(page)
                }
            },
            handleSizeChange(val){//每页数据条数变化
                if(this.tabIndex==="1"){
                    const page={
                        pageSize:val
                    };
                    this.queryPayCase(page)
                }else{
                    const page={
                        pageSize:val
                    };
                    this.querySummaryCases(page)
                }
            },
            changeActive(){//子组件回调
                this.active=0;
                if(this.tabIndex==="1"){
                    this.queryPayCase(null)
                }else{
                    this.querySummaryCases(null)
                }
            },
            queryCaseType(){//查询案件类型
                addCaseService.queryCct(this.$http).then(msg=>{
                    this.caseTypeData=msg.data.data.data
                })
            },
            back(){//返回按钮
                this.queryDetail=true;
                this.querySummaryCases(null)
            },
            queryDetails(id){//查看案件详情
                this.queryDetail=false;
                this.caseId=id
            },
            handlClick(tab){//标签页切换
                this.caseLawSearch.searchData="";//搜索框数据
                this.caseLawSearch.caseApproveStatus="";//审批状态
                this.caseLawSearch.caseCaseTypeId="";//案件类型
                this.caseLawSearch.caseSettleStatus="";//结案状态
                this.caseLawSearch.sortMode="1";//排序方法
                this.tabIndex=tab.index;
                this.active=0;
                this.pageSize=5;
                if(this.tabIndex==="1"){
                    this.queryPayCase(null)
                }else{
                    this.querySummaryCases(null)
                }
            },
            standard(num,id){//费用减免申请
                this.$loading({//懒加载
                    lock: true,
                    text: '正在校验...',
                    spinner: 'fa fa-refresh fa-spin fa-3x',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                if(num===0){
                    const params={
                        id:id
                    };
                    addCaseService.seniorQuery(this.$http,params).then(msg=>{
                        const data=msg.data.data[0].typeinfo;
                        if(data.indexOf("未成年")!==-1||
                            data.indexOf("残疾")!==-1||
                            data.indexOf("老年")!==-1||
                            data.indexOf("农民")!==-1){
                            this.active=1;
                        }else{
                            this.$message({
                                type:"warning",
                                message:"您暂不符合减免申请标准~"
                            })
                        }
                        this.$loading().close()
                    });
                }else{
                    this.$message({
                        type:"warning",
                        message:"您已申请过减免~"
                    });
                    this.$loading().close()
                }
            },
            casePaidsal(caseAgencyfee,caseProxysal,caseSubsidysal,caseFxmoney,casePaidsal){//添加付款记录
                this.caseUnpaidsal=parseInt(caseAgencyfee)+parseInt(caseProxysal)+parseInt(caseFxmoney)-parseInt(caseSubsidysal)-parseInt(casePaidsal);
                if(this.caseUnpaidsal>0){
                    this.active=2
                }else{
                    this.$message({
                        type:"warning",
                        message:"金额都已付清啦~"
                    })
                }
            },
            caseShare(caseShare){//案件共享
                if(caseShare==="1"){
                    const params=new URLSearchParams();
                    params.append("id",this.caseId);
                    params.append("caseShare","2");
                    addCaseService.upCaseLaw(this.$http,params).then(msg=>{
                        if(msg.data.status==="50000"){
                            this.$message({
                                type:"error",
                                message:"出错了呢~"
                            })
                        }else{
                            if(this.tabIndex==="1"){
                                this.queryPayCase(null)
                            }else{
                                this.querySummaryCases(null)
                            }
                            this.$message({
                                type:"success",
                                message:"取消共享成功~"
                            })
                        }
                    })
                }else{
                    const params=new URLSearchParams();
                    params.append("id",this.caseId);
                    params.append("caseShare","1");
                    addCaseService.upCaseLaw(this.$http,params).then(msg=>{
                        if(msg.data.status==="50000"){
                            this.$message({
                                type:"error",
                                message:"出错了呢~"
                            })
                        }else{
                            if(this.tabIndex==="1"){
                                this.queryPayCase(null)
                            }else{
                                this.querySummaryCases(null)
                            }
                            this.$message({
                                type:"success",
                                message:"共享成功~"
                            })
                        }
                    })
                }
            },
            handleClick(id){//下拉菜单按钮点击事件
                this.caseId=id
            },
            cellStyle(column){//单元格样式
                if (column.columnIndex===9||column.columnIndex===10){
                    return "color:red;font-size:20px"
                }
            },
            caseContractFilenumberFormatter(row, column, cellValue){//合同，档案
                if(cellValue==="2"){
                    return "✔"
                }else{
                    return "✘"
                }
            },
            caseSettleStatusFormatter(row, column, cellValue){//结案状态
                if(cellValue==="N"){
                    return "未结案"
                }else{
                    return "已结案"
                }
            },
            caseApproveStatusFormatter(row, column, cellValue){//审批状态
                if(cellValue==="1"){
                    return "审批中"
                }else if(cellValue==="2"){
                    return "审批通过"
                }else{
                    return "审批不通过"
                }
            },
            queryPayCase(param){//查询付款案件
                this.$loading({//懒加载
                    lock: true,
                    text: '正在查询...',
                    spinner: 'fa fa-refresh fa-spin fa-3x',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const params={
                    caseUnpaidsal:"1",
                    searchData:this.caseLawSearch.searchData,//搜索框数据
                    select:this.caseLawSearch.select,//下拉框选项
                    caseApproveStatus:this.caseLawSearch.caseApproveStatus,//审批状态
                    caseCaseTypeId:this.caseLawSearch.caseCaseTypeId,//案件类型
                    caseSettleStatus:this.caseLawSearch.caseSettleStatus,//结案状态
                    sortMode:this.caseLawSearch.sortMode,//排序方法
                    pageNum:param==null?this.pageNum:(param.pageNum===undefined?this.pageNum:param.pageNum),
                    pageSize:param==null?this.pageSize:(param.pageSize===undefined?this.pageSize:param.pageSize)
                };
                addCaseService.querySenior(this.$http,params).then(msg=> {
                    this.caseData = msg.data.data.list;
                    this.total=msg.data.data.total;
                    this.pageSize=msg.data.data.pageSize;
                    this.$loading().close();
                })
            },
            querySummaryCases(param){//查询全所汇总案件
                this.$loading({//懒加载
                    lock: true,
                    text: '正在查询...',
                    spinner: 'fa fa-refresh fa-spin fa-3x',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const params={
                    searchData:this.caseLawSearch.searchData,//搜索框数据
                    select:this.caseLawSearch.select,//下拉框选项
                    caseApproveStatus:this.caseLawSearch.caseApproveStatus,//审批状态
                    caseCaseTypeId:this.caseLawSearch.caseCaseTypeId,//案件类型
                    caseSettleStatus:this.caseLawSearch.caseSettleStatus,//结案状态
                    sortMode:this.caseLawSearch.sortMode,//排序方法
                    pageNum:param==null?this.pageNum:(param.pageNum===undefined?this.pageNum:param.pageNum),
                    pageSize:param==null?this.pageSize:(param.pageSize===undefined?this.pageSize:param.pageSize)
                };
                addCaseService.querySenior(this.$http,params).then(msg=>{
                    this.caseData=msg.data.data.list;
                    this.total=msg.data.data.total;
                    this.pageSize=msg.data.data.pageSize;
                    this.$loading().close();
                })
            },
        }
    }
</script>

<style scoped>

</style>